<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/category.css">
    <script src="js/iscroll.js"></script>
    <title>分类</title>
</head>
<body>
<div class="jd_layout">
<!--    搜索栏-->
    <div class="jd_search">
        <div class="jd_search_box">
            <a href="" class="icon_back"></a>
            <form action="#"><input type="search" placeholder="顶部通栏"></form>
            <a href="" class="icon_menu"></a>
        </div>
    </div>
<!--    主要页面布局-->
    <main class="jd_main">
<!--        左侧导航栏-->
        <div id="wrapper" class="left_part_category">
            <ul>
                <li><a href="#">内衣配饰</a></li>
                <li><a href="#">家用电器</a></li>
                <li class="current"><a href="#">母婴频道</a></li>
                <li><a href="#">家具建材</a></li>
                <li><a href="#">图书</a></li>
                <li><a href="#">内衣配饰</a></li>
                <li><a href="#">家用电器</a></li>
                <li><a href="#">母婴频道</a></li>
                <li><a href="#">家具建材</a></li>
                <li><a href="#">图书</a></li>
                <li><a href="#">内衣配饰</a></li>
                <li><a href="#">家用电器</a></li>
                <li><a href="#">母婴频道</a></li>
                <li><a href="#">图书</a></li>
                <li><a href="#">内衣配饰</a></li>
                <li><a href="#">家用电器</a></li>
                <li><a href="#">母婴频道</a></li>
                <li><a href="#">家具建材</a></li>
                <li><a href="#">图书</a></li>
            </ul>
        </div>
<!--        右侧商品栏-->
        <div class="right_part_goods" id="wrapperr">
            <a href="" class="category_banner"><img src="images/banner_1.jpg" alt=""></a>
            <div class="apart_hotSell">
                <h3>热销</h3>
                <ul class="clearfix">
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                </ul>
            </div>
            <div class="apart_hotSell">
                <h3>热销</h3>
                <ul class="clearfix">
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                </ul>
            </div>
            <div class="apart_hotSell">
                <h3>热销</h3>
                <ul class="clearfix">
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                    <li><a href=""><img src="images/nv-fy.jpg" alt=""><p>毛呢大衣</p></a></li>
                </ul>
            </div>
        </div>
    </main>
</div>

<script>
    window.onload=function (){
        new IScroll(document.querySelector('#wrapper'),{
            scrollX:false,
            scrollY:true
        });
        new IScroll(document.querySelector('#wrapperr'),{
            scrollX:false,
            scrollY:true
        });
    }

</script>
</body>
</html>